<template>
  <div class="about">
    <div class="d-flex justify-center flex-wrap mb-6">
      <div class="img">
        <v-img
          lazy-src="../../src/assets/imgs/list01.gif"
          src="../../src/assets/imgs/list01.gif"
          width="100%"
          height="100%"
        ></v-img>
      </div>
      <div
        class="
          text
          grey
          d-flex
          align-center
          justify-center
          lighten-4
          rounded-lg
        "
      >
        <span class="">
          
        </span>
      </div>
    </div>

    <div class="d-flex justify-center flex-wrap mb-6">
      <v-img
        lazy-src="../../src/assets/imgs/last.jpg"
        src="../../src/assets/imgs/last.jpg"
        width="100%"
        height="100%"
      ></v-img>
    </div>
    <div class="d-flex justify-center flex-wrap mb-6">
      <div class="text grey lighten-4 rounded-lg"></div>
      <div class="img">
        <v-img
          lazy-src="../../src/assets/imgs/list02.gif"
          src="../../src/assets/imgs/list02.gif"
          width="100%"
          height="100%"
        ></v-img>
      </div>
    </div>
  </div>
</template>

<style scoped>
.img {
  width: 40%;
}
.text {
  width: 60%;
}

@media screen and (max-width: 760px) {
  .text {
    width: 100%;
    height: 300px;
  }
}
</style>
